iT邦幫忙

2021 iThome 鐵人賽

DAY 15
0
Mobile Development

就是從無到有寫app系列 第 15

第15天~Spinner

  • 分享至 

  • xImage
  •  

Spinne-下拉式選單 跟ListView很像但是比較小

https://ithelp.ithome.com.tw/upload/images/20220202/20119035QHrVvRzZ8B.png

不是Menu
https://ithelp.ithome.com.tw/upload/images/20220202/20119035D2bBIOVcB0.png


做MainActivity.xml檔

https://ithelp.ithome.com.tw/upload/images/20220202/20119035nYOgKwQcyF.png

spinner反紅還是可以用

https://ithelp.ithome.com.tw/upload/images/20220202/20119035UmOyuRd83v.png

https://ithelp.ithome.com.tw/upload/images/20220202/20119035T9yxJGA5tc.png


做res裡的 strings.xml檔

https://ithelp.ithome.com.tw/upload/images/20220202/20119035V8kRPGKkBz.png

<resources>
    <string name="app_name">Spinner</string>

    <string-array name="meal">
        <item>美式漢堡</item>
        <item>豬肉漢堡</item>
        <item>牛肉漢堡</item>
        <item>泡菜漢堡</item>
        <item>米漢堡</item>
    </string-array>

    <string-array name="drink">
        <item>可樂</item>
        <item>綠茶</item>
        <item>奶茶</item>
        <item>果汁</item>
    </string-array>


</resources>

sp_meal-用綁定
MainActivity.xml檔的資料跟誰綁定看entries

https://ithelp.ithome.com.tw/upload/images/20220202/20119035k5ud7moh9t.png

畫面的"三角形"是不能點的~

https://ithelp.ithome.com.tw/upload/images/20220202/20119035ULjxwuG2l8.png

@是res
array陣列
/meal裡面的樣子

1-sp_meal-用綁定
https://ithelp.ithome.com.tw/upload/images/20220202/20119035WtuAPXjSbs.png


2-sp_drink-在java檔-宣告

String sp1,sp2,sp3;蒐集點到的字串

package com.huang.my_spinner;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.widget.Button;
import android.widget.Spinner;

public class MainActivity extends AppCompatActivity {

    //宣告變數
    Button button;
    Spinner sp_meal,sp_drink,sp_dessert;
    String sp1,sp2,sp3;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
}

把sp_meal,sp_drink,sp_dessert;初始化完.因為sp_meal已經做完了,所以做後面sp_drink,sp_dessert

ArrayAdapter adapter = new ArrayAdapter<>(); 完成轉換的內容

https://ithelp.ithome.com.tw/upload/images/20220202/201190352fRBKjhUx9.png

安卓的前後都要寫+使用下拉參數 android的a要小寫

https://ithelp.ithome.com.tw/upload/images/20220202/20119035uXTCQnZtAJ.png

package com.huang.my_spinner;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.Spinner;

public class MainActivity extends AppCompatActivity {

    //宣告變數
    Button button;
    Spinner sp_meal,sp_drink,sp_dessert;
    String sp1,sp2,sp3;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        sp_meal =findViewById(R.id.sp_meal);
        sp_drink = findViewById(R.id.sp_drink);
        sp_dessert = findViewById(R.id.sp_dessert);

        //第二組:取得array資源
        //取得DATA-->轉換-->元件呈現
        String[] drink =getResources().getStringArray(R.array.drink);
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(
                MainActivity.this,
                android.R.layout.simple_spinner_dropdown_item,
                drink

        );

        //第三組


    }
}

在元件中呈現

package com.huang.my_spinner;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.Spinner;

public class MainActivity extends AppCompatActivity {

    //宣告變數
    Button button;
    Spinner sp_meal,sp_drink,sp_dessert;
    String sp1,sp2,sp3;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        sp_meal =findViewById(R.id.sp_meal);
        sp_drink = findViewById(R.id.sp_drink);
        sp_dessert = findViewById(R.id.sp_dessert);

        //第二組:取得array資源
        //取得DATA-->轉換-->元件呈現
        String[] drink =getResources().getStringArray(R.array.drink);

        //進行轉換成指定的格式
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(
                MainActivity.this,
                android.R.layout.simple_spinner_dropdown_item,
                drink

        );
        //在元件中呈現
        sp_drink.setAdapter(adapter);



        //第三組


    }
}

模擬器看

https://ithelp.ithome.com.tw/upload/images/20220202/20119035Qta8rhZyPu.png

https://ithelp.ithome.com.tw/upload/images/20220202/20119035vWxXPV6CiT.png

https://ithelp.ithome.com.tw/upload/images/20220202/20119035nTHNzSe0o5.png

到目前是純粹看-

3-sp_dessert-匯入res

https://ithelp.ithome.com.tw/upload/images/20220202/20119035uCPNX7HSfz.png

package com.huang.my_spinner;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.Spinner;

public class MainActivity extends AppCompatActivity {

    //宣告變數
    Button button;
    Spinner sp_meal,sp_drink,sp_dessert;
    String sp1,sp2,sp3;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        sp_meal =findViewById(R.id.sp_meal);
        sp_drink = findViewById(R.id.sp_drink);
        sp_dessert = findViewById(R.id.sp_dessert);

        //第二組:取得array資源
        //取得DATA-->轉換-->元件呈現
        String[] drink =getResources().getStringArray(R.array.drink);

        //進行轉換成指定的格式
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(
                MainActivity.this,
                android.R.layout.simple_spinner_dropdown_item,
                drink

        );
        //在元件中呈現
        sp_drink.setAdapter(adapter);

        //第三組
        String[] dessert={"布丁","餅乾","CAKE","不要甜點"};
        ArrayAdapter<String> adapter1 = new ArrayAdapter<String>(
                MainActivity.this,
                android.R.layout.simple_spinner_dropdown_item,
                dessert

        );
        //在元件中呈現
        sp_dessert.setAdapter(adapter1);


    }
}

改下拉字的大小+呈現也是要用java檔-新增layout資料夾

https://ithelp.ithome.com.tw/upload/images/20220202/20119035T6jPeQwIB7.png

https://ithelp.ithome.com.tw/upload/images/20220202/20119035zBFoDEFm1t.png

拉一個textView近來改寬30dp-上下左右不要綁
https://ithelp.ithome.com.tw/upload/images/20220202/20119035POF8AYuqBv.png

字的大小
https://ithelp.ithome.com.tw/upload/images/20220202/201190355kLbixXava.png

背景色-background--選color

https://ithelp.ithome.com.tw/upload/images/20220202/20119035tRYo5pWTTj.png

改layout_margin是10dp

https://ithelp.ithome.com.tw/upload/images/20220202/20119035DaBVbZw2ua.png

字的顏色-textColor

https://ithelp.ithome.com.tw/upload/images/20220202/20119035jvdhGDgdFB.png


再來到程式碼去修改~
https://ithelp.ithome.com.tw/upload/images/20220202/20119035zNlOLTLjDc.png

畫線的要搬家

https://ithelp.ithome.com.tw/upload/images/20220202/20119035iTlQi1Z6WJ.png

把其他的刪掉-剩下長這樣
https://ithelp.ithome.com.tw/upload/images/20220202/20119035xL00GAwndr.png

有出錯就是有重複

https://ithelp.ithome.com.tw/upload/images/20220202/20119035KuGXayDbvO.png

<?xml version="1.0" encoding="utf-8"?>


    <TextView
        xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="30dp"
        android:layout_margin="10dp"
        android:background="@color/purple_200"
        android:text="TextView"
        android:textAppearance="@style/TextAppearance.AppCompat.Large"
        android:textColor="@color/design_default_color_error"
        tools:layout_editor_absoluteX="16dp"
        tools:layout_editor_absoluteY="16dp" />



把第3組加入剛剛設計的

https://ithelp.ithome.com.tw/upload/images/20220202/20119035UELhw53wn7.png

package com.huang.my_spinner;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.Spinner;

public class MainActivity extends AppCompatActivity {

    //宣告變數
    Button button;
    Spinner sp_meal,sp_drink,sp_dessert;
    String sp1,sp2,sp3;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        sp_meal =findViewById(R.id.sp_meal);
        sp_drink = findViewById(R.id.sp_drink);
        sp_dessert = findViewById(R.id.sp_dessert);

        //第二組:取得array資源
        //取得DATA-->轉換-->元件呈現
        String[] drink =getResources().getStringArray(R.array.drink);

        //進行轉換成指定的格式
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(
                MainActivity.this,
                android.R.layout.simple_spinner_dropdown_item,
                drink

        );
        //在元件中呈現
        sp_drink.setAdapter(adapter);

        //第三組
        String[] dessert={"布丁","餅乾","CAKE","不要甜點"};
        ArrayAdapter<String> adapter1 = new ArrayAdapter<String>(
                MainActivity.this,
                android.R.layout.simple_spinner_dropdown_item,
                dessert

        );
        //在元件中呈現
        adapter1.setDropDownViewResource(R.layout.mylayout);
        sp_dessert.setAdapter(adapter1);
            }
}

https://ithelp.ithome.com.tw/upload/images/20220202/20119035FaM732Zl0c.png

只要看第一個com就好..其他是系統測試用-


按鈕完成-
1-初始化按鈕
2-加偵聽器
https://ithelp.ithome.com.tw/upload/images/20220202/20119035P2z0jSVg7W.png

3-選到的項目轉成字串

https://ithelp.ithome.com.tw/upload/images/20220202/20119035wKZoxmDEIC.png

package com.huang.my_spinner;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.Spinner;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    //宣告變數
    Button button;
    Spinner sp_meal,sp_drink,sp_dessert;
    String sp1,sp2,sp3;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        sp_meal =findViewById(R.id.sp_meal);
        sp_drink = findViewById(R.id.sp_drink);
        sp_dessert = findViewById(R.id.sp_dessert);

        //第二組:取得array資源
        //取得DATA-->轉換-->元件呈現
        String[] drink =getResources().getStringArray(R.array.drink);

        //進行轉換成指定的格式
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(
                MainActivity.this,
                android.R.layout.simple_spinner_dropdown_item,
                drink

        );
        //在元件中呈現
        sp_drink.setAdapter(adapter);

        //第三組
        String[] dessert={"布丁","餅乾","CAKE","不要甜點"};
        ArrayAdapter<String> adapter1 = new ArrayAdapter<String>(
                MainActivity.this,
                android.R.layout.simple_spinner_dropdown_item,
                dessert

        );
        //在元件中呈現
        adapter1.setDropDownViewResource(R.layout.mylayout);
        sp_dessert.setAdapter(adapter1);

        //Button
        button = findViewById(R.id.button);
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                //第1組
                sp1 =sp_meal.getSelectedItem().toString();
                Toast.makeText(MainActivity.this,sp1,Toast.LENGTH_SHORT).show();

                //第2組
                sp2 =sp_drink.getSelectedItem().toString();
                Toast.makeText(MainActivity.this,sp2,Toast.LENGTH_SHORT).show();

                //第3組
                sp3 =sp_dessert.getSelectedItem().toString();
                Toast.makeText(MainActivity.this,sp3,Toast.LENGTH_SHORT).show();

            }
        });

        }
}

Toast也是要用手機測試才看的到-

https://ithelp.ithome.com.tw/upload/images/20220202/20119035EwMOwXeVXw.jpg

https://ithelp.ithome.com.tw/upload/images/20220202/20119035cMvYUgIyuM.jpg

https://ithelp.ithome.com.tw/upload/images/20220202/20119035xzdnv2Faby.jpg

https://ithelp.ithome.com.tw/upload/images/20220202/20119035rwRW03wtj8.jpg


前面~都補好了喔
/images/emoticon/emoticon08.gif

0.0居然被發現偷吃步在續命的方法了~
我真的很想好好寫
但是因為肚子會餓~需要先賺錢錢
要努力擠出時間~
大大有興趣可以看我去年modern web是有補好的喔~
今年會努力在完賽前補好的...


上一篇
第14天~
下一篇
第16天~ListView
系列文
就是從無到有寫app31
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 則留言

0
janlin002
iT邦好手 1 級 ‧ 2021-09-30 17:27:41

原來還有這招?!我學會了 /images/emoticon/emoticon08.gif

Tzu iT邦新手 1 級 ‧ 2021-09-30 20:39:11 檢舉

我真的是不得已的.....QQ

我要留言

立即登入留言